<!DOCTYPE html>
{% load staticfiles%}
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>首页</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href={% static 'css/app.css' %} />
    <!--<script charset="UTF-8" async="" src="./index/gettype.php"></script>-->
    <script charset="UTF-8" async="" src={% static 'js/fullpage.8.6.6.js'%} />
    </script>
    <!--<script charset="UTF-8" src="./index/get.php"></script>-->
    <link href={% static 'css/style_https.1.5.4.css'%} rel="stylesheet">

</head>
<body class="pushable">
<div class="ui vertical sidebar menu right" data-attach="[data-selector=&quot;sidebar toc&quot;]">
    <form action="#">
        {% csrf_token %}
        <div class="item">
            <div class="ui icon input">
                <input name="q" type="text" placeholder="搜索看云...">
                <i class="search icon"></i>
            </div>
        </div>
    </form>
    <a class="item" href="#">广场</a>
    <a class="item" href="#">客户端</a>
    <a class="item" href="#">帮助</a>
    <a class="item" href="#">登录</a>
    <a class="item" href="#">注册</a>
</div>
<div class="pusher">
    <div class="w-page m-welcome">
        <div class="page-head">
            <div class="ui menu small secondary fixed">
                <a class="logo item" href="#"></a>
                <a class="item" href="#">广场</a>
                <a class="item" href="#">客户端</a>
                <a class="item" href="https://help.kancloud.cn/">帮助</a>

                <div class="right menu ">
                    <a class="toc item" data-selector="sidebar toc">
                        <i class="ellipsis vertical icon"></i>
                    </a>
                    <form action="#">
                        {% csrf_token %}
                        <div class="item">
                            <div class="ui icon input">
                                <input name="q" type="text" placeholder="搜索看云...">
                                <i class="search icon"></i>
                            </div>
                        </div>
                    </form>
                    <a class="item" href="#">登录</a>
                    <a class="item" href="register">注册</a>
                </div>
            </div>
        </div>

        <div class="page-body">
            <div class="ui nags"></div>
            <div class="banner">
                <div class="ui container">
                    <div class="info">
                        <div class="logo"></div>
                        <h2>专注于文档在线创作、协作和托管</h2>
                        <h3>让写作更方便 发布更简单</h3>
                        <a href="#" class="explore">随便看看</a>
                    </div>
                    <div class="login">
                        <form class="ui form" data-action="index" action="login" method="post" autocomplete="off">
                            {% csrf_token %}
                            <div class="ui error message"></div>
                            <div class="field">
                                <input class="text-input" type="text" name="nickname" placeholder="用户名">
                            </div>
                            <div class="field">
                                <input class="text-input" type="password" name="password" placeholder="密码">
                            </div>
                            <!--<div class="fields inline" id="geetest">-->
                                <!--<div class="geetest_holder geetest_wind geetest_detect" style="width: 100%;">-->
                                    <!--<div class="geetest_form">-->
                                        <!--<input type="hidden" name="geetest_challenge">-->
                                        <!--<input type="hidden" name="geetest_validate">-->
                                        <!--<input type="hidden" name="geetest_seccode">-->
                                    <!--</div>-->
                                    <!--<div class="geetest_btn">-->
                                        <!--<div class="geetest_radar_btn">-->
                                            <!--<div class="geetest_radar">-->
                                                <!--<div class="geetest_ring">-->
                                                    <!--<div class="geetest_small"></div>-->
                                                <!--</div>-->
                                                <!--<div class="geetest_sector" style="transform: rotate(-83.0139deg);">-->
                                                    <!--<div class="geetest_small"></div>-->
                                                <!--</div>-->
                                                <!--<div class="geetest_cross">-->
                                                    <!--<div class="geetest_h"></div>-->
                                                    <!--<div class="geetest_v"></div>-->
                                                <!--</div>-->
                                                <!--<div class="geetest_dot"></div>-->
                                                <!--<div class="geetest_scan">-->
                                                    <!--<div class="geetest_h"></div>-->
                                                <!--</div>-->
                                                <!--<div class="geetest_status">-->
                                                    <!--<div class="geetest_bg"></div>-->
                                                    <!--<div class="geetest_hook"></div>-->
                                                <!--</div>-->
                                            <!--</div>-->
                                            <!--<div class="geetest_ie_radar"></div>-->
                                            <!--<div class="geetest_radar_tip" tabindex="0" aria-label="点击按钮进行验证" style="outline-width: 0px;">-->
                                                <!--<span class="geetest_radar_tip_content">点击按钮进行验证</span>-->
                                                <!--<span class="geetest_reset_tip_content">请点击重试</span>-->
                                                <!--<span class="geetest_radar_error_code"></span>-->
                                            <!--</div>-->
                                            <!--<a class="geetest_logo" target="_blank"-->
                                               <!--href="http://www.geetest.com/first_page"></a>-->
                                            <!--<div class="geetest_other_offline geetest_offline"></div>-->
                                        <!--</div>-->
                                        <!--<div class="geetest_ghost_success">-->
                                            <!--<div class="geetest_success_btn">-->
                                                <!--<div class="geetest_success_box">-->
                                                    <!--<div class="geetest_success_show">-->
                                                        <!--<div class="geetest_success_pie"></div>-->
                                                        <!--<div class="geetest_success_filter"></div>-->
                                                        <!--<div class="geetest_success_mask"></div>-->
                                                    <!--</div>-->
                                                    <!--<div class="geetest_success_correct">-->
                                                        <!--<div class="geetest_success_icon"></div>-->
                                                    <!--</div>-->
                                                <!--</div>-->
                                                <!--<div class="geetest_success_radar_tip"><span-->
                                                        <!--class="geetest_success_radar_tip_content"></span><span-->
                                                        <!--class="geetest_success_radar_tip_timeinfo"></span></div>-->
                                                <!--<a class="geetest_success_logo" target="_blank"-->
                                                   <!--href="http://www.geetest.com/first_page"></a>-->
                                                <!--<div class="geetest_success_offline geetest_offline"></div>-->
                                            <!--</div>-->
                                        <!--</div>-->
                                        <!--<div class="geetest_slide_icon"></div>-->
                                    <!--</div>-->
                                    <!--<div class="geetest_wait"><span class="geetest_wait_dot geetest_dot_1"></span><span-->
                                            <!--class="geetest_wait_dot geetest_dot_2"></span><span-->
                                            <!--class="geetest_wait_dot geetest_dot_3"></span></div>-->
                                    <!--<div class="geetest_fullpage_click">-->
                                        <!--<div class="geetest_fullpage_ghost"></div>-->
                                        <!--<div class="geetest_fullpage_click_wrap">-->
                                            <!--<div class="geetest_fullpage_click_box"></div>-->
                                            <!--<div class="geetest_fullpage_pointer">-->
                                                <!--<div class="geetest_fullpage_pointer_out"></div>-->
                                                <!--<div class="geetest_fullpage_pointer_in"></div>-->
                                            <!--</div>-->
                                        <!--</div>-->
                                    <!--</div>-->
                                    <!--<div class="geetest_goto" style="display: none;">-->
                                        <!--<div class="geetest_goto_ghost"></div>-->
                                        <!--<div class="geetest_goto_wrap">-->
                                            <!--<div class="geetest_goto_content">-->
                                                <!--<div class="geetest_goto_content_tip"></div>-->
                                            <!--</div>-->
                                            <!--<div class="geetest_goto_cancel"></div>-->
                                            <!--<a class="geetest_goto_confirm"></a></div>-->
                                    <!--</div>-->
                                    <!--<div class="geetest_panel">-->
                                        <!--<div class="geetest_panel_ghost"></div>-->
                                        <!--<div class="geetest_panel_box">-->
                                            <!--<div class="geetest_other_offline geetest_panel_offline"></div>-->
                                            <!--<div class="geetest_panel_loading">-->
                                                <!--<div class="geetest_panel_loading_icon"></div>-->
                                                <!--<div class="geetest_panel_loading_content"></div>-->
                                            <!--</div>-->
                                            <!--<div class="geetest_panel_success">-->
                                                <!--<div class="geetest_panel_success_box">-->
                                                    <!--<div class="geetest_panel_success_show">-->
                                                        <!--<div class="geetest_panel_success_pie"></div>-->
                                                        <!--<div class="geetest_panel_success_filter"></div>-->
                                                        <!--<div class="geetest_panel_success_mask"></div>-->
                                                    <!--</div>-->
                                                    <!--<div class="geetest_panel_success_correct">-->
                                                        <!--<div class="geetest_panel_success_icon"></div>-->
                                                    <!--</div>-->
                                                <!--</div>-->
                                                <!--<div class="geetest_panel_success_title"></div>-->
                                            <!--</div>-->
                                            <!--<div class="geetest_panel_error">-->
                                                <!--<div class="geetest_panel_error_icon"></div>-->
                                                <!--<div class="geetest_panel_error_title"></div>-->
                                                <!--<div class="geetest_panel_error_content"></div>-->
                                                <!--<div class="geetest_panel_error_code"></div>-->
                                            <!--</div>-->
                                            <!--<div class="geetest_panel_footer">-->
                                                <!--<div class="geetest_panel_footer_logo"></div>-->
                                                <!--<div class="geetest_panel_footer_copyright"></div>-->
                                            <!--</div>-->
                                            <!--<div class="geetest_panel_next"></div>-->
                                        <!--</div>-->
                                    <!--</div>-->
                                <!--</div>-->
                            <!--</div>-->

                            <div class="two fields">
                                <div class="field">
                                    <div class="ui checkbox">
                                        <!--<input name="remember" type="checkbox" checked="checked" tabindex="0"-->
                                               <!--class="hidden">-->
                                        <!--<label>保持登录</label>-->
                                    </div>
                                </div>
                                <div class="field" style="text-align: right;">
                                    <a href="#">忘记密码？</a>
                                </div>
                            </div>

                            <div class="field">
                                <button class="ui button green fluid" type="submit">立即登录</button>
                            </div>

                            <div class="field">
                                <h4 class="ui header">使用第三方帐号登录</h4>
                                <div class="ui four column grid">
                                    <div class="column center aligned">
                                        <a href="#"
                                           class="ui circular button icon github huge">
                                            <i class="icon github"></i>
                                        </a>
                                    </div>
                                    <div class="column center aligned">
                                        <a href="#"
                                           class="ui circular button icon wechat huge">
                                            <i class="icon wechat"></i>
                                        </a>
                                    </div>
                                    <div class="column center aligned">
                                        <a href="#"
                                           class="ui circular button icon qq huge">
                                            <i class="icon qq"></i>
                                        </a>
                                    </div>
                                    <div class="column center aligned">
                                        <a href="#"
                                           class="ui circular button icon weibo huge">
                                            <i class="icon weibo"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="field">
                                <a href="register">没有帐号，点击注册</a>
                            </div>

                        </form>

                    </div>
                </div>
            </div>

            <div class="ui container ">
                <div class="functional">
                    <div class="item">
                        <h4><i class="icon circular inverted green markdown"></i>MarkDown</h4>
                        <p>在MarkDown标准规范的基础上，做了一些体验上的改进，增加了一些个性化标签和TeX公式支持，并且在编辑的同时可以实时预览，新手简单上手，给你非一般的写作感受。</p>

                    </div>
                    <div class="item">
                        <h4><i class="icon circular inverted green git"></i><span>版本控制 </span></h4>
                        <p>基于Git版本库管理文档历史记录，让你的文档修订有迹可循，随时还原，同时可以完成离线编辑和远程推送，或者同步推送到其它的Git服务器。</p>

                    </div>
                    <div class="item">
                        <h4><i class="icon circular inverted green team"></i><span>团队协作</span></h4>
                        <p>多人在线和离线方式进行文档协作编辑，并支持文档和团队成员的角色授权，包括管理、编辑和阅读权限。</p>

                    </div>
                    <div class="item">
                        <h4><i class="icon circular inverted green api"></i><span>API文档</span></h4>
                        <p>看云独有格式，让你快速定义和生成API文档，并支持在线调试，移动APP接口开发的必须。</p>

                    </div>
                    <div class="item">
                        <h4><i class="icon circular inverted green exchange"></i><span>导入导出  </span></h4>
                        <p>支持CHM/EPUB格式导入以及EPUB/PDF/WORD格式导出，并且可以导入Github上的文档，单页面内容可以采用HTML一键导入。</p>

                    </div>
                    <div class="item">
                        <h4><i class="icon circular inverted green diy"></i><span>个性化</span></h4>
                        <p>通过给文档绑定域名和自定义阅读页面的样式及导航，彰显作者个性化文档表现和品牌需求。</p>

                    </div>
                </div>
                <div class="ui divider"></div>
                <div class="slogan">
                    <h2>超过<strong>80,000人</strong>使用看云进行文档写作</h2>
                    <h3>从现在开始，把文档托管到云端！</h3>
                    <a href="#" class="explore">立即体验</a>
                </div>
            </div>

        </div>

        <div class="page-foot">
            <div class="ui container">
                <div class="w-copyright">
                    <div class="left">
                        <p>© 2015-2019 上海顶想信息科技有限公司</p>
                        <div class="ui list horizontal">
                            <a class="item" href="#">关于我们</a>
                            <a class="item" href="#">反馈建议</a>
                            <a class="item" href="#">合作伙伴</a>
                            <a class="item" href="#">产品价格</a>
                            <a class="item" href="#">官方博客</a>
                        </div>
                    </div>
                    <div class="right">
                        <a class="logo" href="#"></a>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

<script src={% static 'js/jquery.min.js'%}></script>
<script src={% static 'js/semantic.min.js'%}></script>
<script type="text/javascript" src={% static 'js/app.js'%}></script>
</body>
</html>